Initial commitHEADmain

Created from https://vercel.com/new

1 files changed, 17 insertions, 0 deletions

diff --git a/src/app/(main)/websites/[websiteId]/realtime/RealtimeHeader.tsx b/src/app/(main)/websites/[websiteId]/realtime/RealtimeHeader.tsx
new file mode 100644
index 0000000..2b9d881
--- /dev/null
+++ b/src/app/(main)/websites/[websiteId]/realtime/RealtimeHeader.tsx
@@ -0,0 +1,17 @@
+import { useMessages } from '@/components/hooks';
+import { MetricCard } from '@/components/metrics/MetricCard';
+import { MetricsBar } from '@/components/metrics/MetricsBar';
+
+export function RealtimeHeader({ data }: { data: any }) {
+  const { formatMessage, labels } = useMessages();
+  const { totals }: any = data || {};
+
+  return (
+    <MetricsBar>
+      <MetricCard label={formatMessage(labels.views)} value={totals.views} />
+      <MetricCard label={formatMessage(labels.visitors)} value={totals.visitors} />
+      <MetricCard label={formatMessage(labels.events)} value={totals.events} />
+      <MetricCard label={formatMessage(labels.countries)} value={totals.countries} />
+    </MetricsBar>
+  );
+}